import { Button, Modal, Form, Input, Row, Select, Col, DatePicker, Space } from 'antd';
import React, { useState,useEffect } from 'react';
import { useMemo } from 'react';

const ItemFrom = function (props) {
    const { visible, setVisible, rowInfo = {}, getChildrenValue,heardtitle } = props
   
    const [form] = Form.useForm();
    //点击提交按钮
    const onFinish = (values) => {
        setVisible(false);
        getChildrenValue(values, rowInfo._id)
    };
    //点击取消按钮
    const handleCancel = () => {
        setVisible(false);
    };
    const onFinishFailed = (errorInfo) => {
        console.log('Failed:', errorInfo);
    };

    useEffect(() => {
      form.setFieldsValue({
          name: rowInfo.name,
          order: rowInfo.order,
          description: rowInfo.description
      })
    }, [rowInfo]);
    return (
        <Modal
        getContainer={false}
        title={Array.isArray(heardtitle)?heardtitle[1]+'学科':heardtitle +'学科'}
         visible={visible}
         footer={null}
         onCancel={handleCancel}
       >
        {
        heardtitle==='详情'?
        <Form
           form={form}//与表格连接起关系，不然form.setFieldsValue会不起作用
           onFinish={onFinish}
           onFinishFailed={onFinishFailed}
           initialValues={{
            name: rowInfo.name,
            order: rowInfo.order,
            description: rowInfo.description
           }}
         >
               <Form.Item
                 name="name"
                 label="学科名"
                 rules={[
                   {
                     required: true,
                     message: '请输入新增的学科'
                   },
                 ]}
               >
                 <Input placeholder="请输入新增的学科"/>
               </Form.Item>
               <Form.Item
                 name="order"
                 label="学科排序"
                 rules={[
                   {
                     message: '学科排序',
                   },
                 ]}
               >
                 <Input placeholder="请输入学科的排序"/>
               </Form.Item>
               <Form.Item
                 name="description"
                 label="学科介绍"
                 rules={[
                   {
                     message: '学科介绍',
                   },
                 ]}
               >
                 <Input.TextArea rows={4} placeholder="学科介绍信息" />
               </Form.Item>
               {/* <Row gutter={16} style={{textAlign:'right'}} >
                  <Col span={24} >
                    <Button htmlType="submit" type="primary" style={{marginRight:'8px',width:'80px',height:'35px'}}> 提交</Button>
                    <Button onClick={handleCancel} style={{marginRight:'15px',width:'80px',height:'35px'}}>取消</Button>     
                  </Col>
              </Row>  */}
         </Form>
        :
         <Form
           form={form}//与表格连接起关系，不然form.setFieldsValue会不起作用
           onFinish={onFinish}
           onFinishFailed={onFinishFailed}
           initialValues={{
            name: rowInfo.name,
            order: rowInfo.order,
            description: rowInfo.description
           }}
         >
               <Form.Item
                 name="name"
                 label="学科名"
                 rules={[
                   {
                     required: true,
                     message: '请输入新增的学科'
                   },
                 ]}
               >
                 <Input placeholder="请输入新增的学科"/>
               </Form.Item>
               <Form.Item
                 name="order"
                 label="学科排序"
                 rules={[
                   {
                     message: '学科排序',
                   },
                 ]}
               >
                 <Input placeholder="请输入学科的排序"/>
               </Form.Item>
               <Form.Item
                 name="description"
                 label="学科介绍"
                 rules={[
                   {
                     message: '学科介绍',
                   },
                 ]}
               >
                 <Input.TextArea rows={4} placeholder="学科介绍信息" />
               </Form.Item>
               <Row gutter={16} style={{textAlign:'right'}} >
                  <Col span={24} >
                    <Button htmlType="submit" type="primary" style={{marginRight:'8px',width:'80px',height:'35px'}}> 提交</Button>
                    <Button onClick={handleCancel} style={{marginRight:'15px',width:'80px',height:'35px'}}>取消</Button>     
                  </Col>
              </Row> 
         </Form>
        }
         </Modal>    
    )
}
export default ItemFrom;